$(document).ready(function() {

    
 // 打开登录
//  $('.loginsbtn').click(function() {
//     $('.registerbtn').hide();
//     $('.loginbtn').show();
    
// });
//  // 注册
//  $('.ressbtn').click(function() {
//     $('.loginbtn').hide();
//     $('.registerbtn').show();
    
// });
    
    // 登录方式切换
    $('.loginTitle .item').click(function() {
        // 移除所有active类
        $('.loginTitle .item').removeClass('active');
        // 为当前点击项添加active类
        $(this).addClass('active');
        
        // 获取当前登录方式
        const loginType = $(this).text();
        
        // 根据登录方式切换表单内容
        if(loginType === '手机登录') {
            $('.form-input').hide()
            $('.form-input').eq(0).show();
            $('.form-input').eq(0).find('input').attr('placeholder', '请输入手机号');
            $('.form-input').eq(1).show();
            $('.form-input').eq(1).find('input').attr('placeholder', '请输入验证码');
            // $('.form-input').eq(2).hide();
        } else {
            $('.form-input').eq(0).find('input').attr('placeholder', '请输入手机号');
            $('.form-input').eq(1).hide();
            $('.form-input').eq(2).show();
            $('.form-input').eq(2).find('input').attr('placeholder', '请输入密码');

        }
    });

    // 注册方式切换
    $('.registerTitle .item').click(function() {
        // 移除所有active类
        $('.registerTitle .item').removeClass('active');
        // 为当前点击项添加active类
        $(this).addClass('active');
        
        // 获取当前注册方式
        const registerType = $(this).text();
        
        // 根据注册方式切换表单内容
        if(registerType === '手机注册') {
            $('.form-input').eq(0).find('input').attr('placeholder', '请输入手机号');
            $('.form-input').eq(1).show();
            $('.form-input').eq(1).find('input').attr('placeholder', '请输入验证码');
        } else {
            $('.form-input').eq(0).find('input').attr('placeholder', '请输入邮箱');
            $('.form-input').eq(1).show();
            $('.form-input').eq(1).find('input').attr('placeholder', '请输入验证码');
        }
    });
    

    // 立即注册点击事件
    $('.doReg a').click(function(e) {
        e.preventDefault();
        // 隐藏登录弹窗
        $('.userLogPane').hide();
        // 显示注册弹窗
        $('.registerPane').show();
    });

    // 返回登录点击事件
    $('.doLogin a').click(function(e) {
        e.preventDefault();
        // 隐藏注册弹窗
        $('.registerPane').hide();
        // 显示登录弹窗
        $('.userLogPane').show();
    });

    // 关闭按钮点击事件
    $('.close').click(function() {
        $(this).closest('.userLogPane, .registerPane').hide();
    });

    // 获取验证码点击事件
    $('.getcode').click(function() {
        
        const $this = $(this);
        if($this.hasClass('disabled')) return;
        
        // 获取手机号或邮箱
        const $input = $(this).closest('.form-input').prev('.form-input').find('input');
        const account = $input.val().trim();
        console.log(!account)
        // 验证手机号或邮箱格式
        if (!account) {
           
            showToast('请输入手机号');
            return;
        }
        
        // 验证手机号格式
        if ($input.attr('placeholder').includes('手机号') && !/^1[3-9]\d{9}$/.test(account)) {
            showToast('请输入正确的手机号');
            return;
        }
        
        // 验证邮箱格式
        if ($input.attr('placeholder').includes('邮箱') && !/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(account)) {
            showToast('请输入正确的邮箱');
            return;
        }
        
        // 发送验证码请求
        const isPhone = $input.attr('placeholder').includes('手机号');
        const type = isPhone ? 'phone' : 'email';
        
        // 调用发送验证码API
        sendVerificationCode(account, type);
        
        // 添加禁用状态
        $this.addClass('disabled');
        
        // 倒计时60秒
        let countdown = 60;
        $this.text(countdown + '秒后重新获取');
        
        const timer = setInterval(function() {
            countdown--;
            if(countdown > 0) {
                $this.text(countdown + '秒后重新获取');
            } else {
                clearInterval(timer);
                $this.removeClass('disabled');
                $this.text('获取验证码');
            }
        }, 1000);
    });
    
    // 登录按钮点击事件
    $('.loginbtn .el-button--orange').click(function() {
        // 获取登录方式
        const loginType = $('.loginTitle .item.active').text();
        
        // 获取表单数据
        const phone = $('.loginbtn .form-input').eq(0).find('input').val().trim();
        
        if (!phone) {
            showToast('请输入手机号');
            return;
        }
        
        if (!/^1[3-9]\d{9}$/.test(phone)) {
            showToast('请输入正确的手机号');
            return;
        }
        
        if (loginType === '手机登录') {
            // 手机验证码登录
            const code = $('.loginbtn .form-input').eq(1).find('input').val().trim();
            
            if (!code) {
                showToast('请输入验证码');
                return;
            }
            
            if (!/^\d{6}$/.test(code)) {
                showToast('请输入6位数字验证码');
                return;
            }
            
            // 调用手机验证码登录API
            loginWithPhoneCode(phone, code);
        } else {
            // 密码登录
            const password = $('.loginbtn .form-input').eq(2).find('input').val().trim();
            
            if (!password) {
                showToast('请输入密码');
                return;
            }
            
            // 调用密码登录API
            loginWithPassword(phone, password);
        }
    });
    
    // 注册按钮点击事件
    $('.registerPane .el-button--orange').click(function() {
        // 获取注册方式
        const registerType = $('.registerTitle .item.active').text();
        
        // 获取表单数据
        const account = $('.registerPane .form-input').eq(0).find('input').val().trim();
        const code = $('.registerPane .form-input').eq(1).find('input').val().trim();
        const password = $('.registerPane .form-input').eq(2).find('input').val().trim();
        const confirmPassword = $('.registerPane .form-input').eq(3).find('input').val().trim();
        
        // 验证表单数据
        if (!account) {
            showToast(registerType === '手机注册' ? '请输入手机号' : '请输入邮箱');
            return;
        }
        
        if (registerType === '手机注册') {
            if (!/^1[3-9]\d{9}$/.test(account)) {
                showToast('请输入正确的手机号');
                return;
            }
        } else {
            if (!/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(account)) {
                showToast('请输入正确的邮箱');
                return;
            }
        }
        
        if (!code) {
            showToast('请输入验证码');
            return;
        }
        
        if (!/^\d{6}$/.test(code)) {
            showToast('请输入6位数字验证码');
            return;
        }
        
        if (!password) {
            showToast('请设置密码');
            return;
        }
        
        if (password.length < 6) {
            showToast('密码长度不能少于6位');
            return;
        }
        
        if (password !== confirmPassword) {
            showToast('两次输入的密码不一致');
            return;
        }
        
        // 调用注册API
        const isPhone = registerType === '手机注册';
        register(account, code, password, isPhone);
    });
    
    // 发送验证码API
    function sendVerificationCode(account, type) {
        // 这里使用模拟API调用，实际项目中应该替换为真实的API
        console.log('发送验证码', account, type);
        
        // 模拟API调用
        setTimeout(function() {
            // 模拟成功响应
            showToast('验证码已发送，请注意查收');
        }, 1000);
    }
    
    // 手机验证码登录API
    function loginWithPhoneCode(phone, code) {
        // 这里使用模拟API调用，实际项目中应该替换为真实的API
        console.log('手机验证码登录', phone, code);
        
        // 模拟API调用
        setTimeout(function() {
            // 模拟成功响应
            const userInfo = {
                id: 1,
                username: '用户' + phone.substr(-4),
                phone: phone,
                avatar: 'img/default-avatar.png'
            };
            
            // 保存用户信息到本地存储
            localStorage.setItem('userInfo', JSON.stringify(userInfo));
            
            // 显示登录成功提示
            showToast('登录成功');
            
            // 关闭登录弹窗
            $('.userLogPane').hide();
            
            // 更新页面上的用户信息显示
            updateUserInfoDisplay(userInfo);
        }, 1000);
    }
    
    // 密码登录API
    function loginWithPassword(phone, password) {
        // 这里使用模拟API调用，实际项目中应该替换为真实的API
        console.log('密码登录', phone, password);
        
        // 模拟API调用
        setTimeout(function() {
            // 模拟成功响应
            const userInfo = {
                id: 1,
                username: '用户' + phone.substr(-4),
                phone: phone,
                avatar: 'img/default-avatar.png'
            };
            
            // 保存用户信息到本地存储
            localStorage.setItem('userInfo', JSON.stringify(userInfo));
            
            // 显示登录成功提示
            showToast('登录成功');
            
            // 关闭登录弹窗
            $('.userLogPane').hide();
            
            // 更新页面上的用户信息显示
            updateUserInfoDisplay(userInfo);
        }, 1000);
    }
    
    // 注册API
    function register(account, code, password, isPhone) {
        // 这里使用模拟API调用，实际项目中应该替换为真实的API
        console.log('注册', account, code, password, isPhone);
        
        // 模拟API调用
        setTimeout(function() {
            // 模拟成功响应
            showToast('注册成功，请登录');
            
            // 关闭注册弹窗
            $('.registerPane').hide();
            
            // 显示登录弹窗
            $('.userLogPane').show();
        }, 1000);
    }
    
    // 显示提示信息
    function showToast(message) {
        // 检查是否已存在toast元素
        let toast = $('.toast-message');
        if (toast.length === 0) {
            // 创建toast元素
            toast = $('<div class="toast-message"></div>');
            $('body').append(toast);
        }
        
        // 设置消息内容
        toast.text(message);
        
        // 显示toast
        toast.addClass('show');
        
        // 3秒后隐藏
        setTimeout(function() {
            toast.removeClass('show');
        }, 3000);
    }
    
    // 更新页面上的用户信息显示
    function updateUserInfoDisplay(userInfo) {
        // 更新用户头像
        $('.user-avatar').attr('src', userInfo.avatar);
        
        // 更新用户名
        $('.user-name').text(userInfo.username);
        
        // 显示用户信息区域，隐藏登录按钮
        $('.user-info').show();
        $('.login-btn').hide();
    }
    
    // 页面加载时检查用户是否已登录
    function checkLoginStatus() {
        const userInfoStr = localStorage.getItem('userInfo');
        if (userInfoStr) {
            try {
                const userInfo = JSON.parse(userInfoStr);
                updateUserInfoDisplay(userInfo);
            } catch (e) {
                console.error('解析用户信息失败', e);
                localStorage.removeItem('userInfo');
            }
        }
    }
    
    // 页面加载时检查登录状态
    checkLoginStatus();
    
    // 退出登录
    $('.logout-btn').click(function() {
        // 清除本地存储中的用户信息
        localStorage.removeItem('userInfo');
        
        // 隐藏用户信息区域，显示登录按钮
        $('.user-info').hide();
        $('.login-btn').show();
        
        // 显示退出成功提示
        showToast('已退出登录');
    });
}); 